import { useState, useEffect } from "react";
import { Form, message } from "antd";
import { Input } from "@/views/components/PrefixPlaceholder";
import { inventoryWarnValue } from "../service";
import { CommonModal } from "@/views/components/CommonModal";
const SafeValueModal = ({ visible, fetchList, selectedKeys, handleCancel }) => {
	const [form] = Form.useForm();

	useEffect(() => {
		if (visible) {
			form.resetFields();
		}
	}, [visible]);

	const onOk = () => {
		form.validateFields().then(async value => {
			console.log(value, "value");
			if (Number(value.lowWarn) > Number(value.highWarn)) return message.error("下限值不能大于上限，请重新输入");
			const { success } = await inventoryWarnValue({
				skuIdList: selectedKeys,
				lowWarn: value.lowWarn,
				highWarn: value.highWarn
			});
			if (success) {
				message.success("设置成功");
				onCancel();
				fetchList();
			}
		});
	};
	const onCancel = () => {
		handleCancel();
		form.resetFields();
	};

	return (
		<CommonModal title={{ title: "设置发货仓安全库存值" }} visible={true} onOk={onOk} onCancel={onCancel} minHeight="150px">
			<Form form={form} name="mark-unuaual-modal">
				<Form.Item
					name="lowWarn"
					label=""
					rules={[
						{
							pattern: /^([0-9]\d*)$/,
							message: "请输入正整数"
						}
					]}
				>
					<Input allowClear placeholder="请输入安全库存下限值" />
				</Form.Item>
				<Form.Item
					name="highWarn"
					label=""
					rules={[
						{
							pattern: /^([0-9]\d*)$/,
							message: "请输入正整数"
						}
					]}
				>
					<Input allowClear placeholder="请输入安全库存上限值" />
				</Form.Item>
			</Form>
		</CommonModal>
	);
};

export default SafeValueModal;
